@charset "UTF-8";
/*PonTONE v1.3.3*/
/* CSS Document */
body{
    position: relative;
    display: flex;
    justify-content: flex-end;
    align-items: flex-start;
    background-color:hsla(0,0%,20%,1.00);
    font-family: sans-serif;
	/*color:white;*/
}

.main{
	position:fixed;/*for body*/
	top:0;
	left:0;
	width:100%;
	height:100%;

    display: flex;          /* Flexboxを指定 */
    justify-content: center;  /*水平方向の中央寄せ */
    align-items: center;  /* 垂直方向の中央寄せ */
    /*background-color:rgba(255,255,255,1.00);  */
}
.content{
}
.view{
    /*display: flex;
    flex-direction: column;
    align-items: center;  /* 垂直方向の中央寄せ */
}
.button_background{
    position: relative;
    display:flex;
	flex-direction:row;
  	flex-wrap:wrap;
    justify-content:space-around;
	align-content: space-around;
    width:720px;
	/*height:300px;*/
	border-radius: 10px;
	/*color: white;*/
	background-color:hsla(208,100%,97%,1.00);    
}

#tytle_bar{
    display: none; /* Flexboxを指定 */
    justify-content:flex-end;
	align-items: baseline;
    width:inherit;
    /*height:0px;*/
}
#tytle{
	display:block;
    color:hsla(208,100%,97%,1.00); 
    font-weight: bold; 
    text-shadow:1px 1px 1px black,0px -0px 0px black,-0px 0px 1px black,-0px -0px 0px black;
}
#l_P{
    letter-spacing: -2px;
    font-size: 14.5pt ;
    transform: scale(1, 1.25);
    display: inline-block;
    vertical-align:1.5px; 
}
#l_o{
    font-size: 14pt ;
    letter-spacing: -0.5px;
}
#l_n{
    font-size: 14pt ;
    letter-spacing: -3px;
}
#l_T{
    letter-spacing: -3.0px;
    font-size: 14.5pt ;
    transform: scale(1, 1.25);
    display: inline-block;
    vertical-align: 1.5px; 
}
#l_ONE{
    font-size: 14pt ;
    letter-spacing: -1.5px;
}
#version{color:aliceblue; font-size: 12px; font-kerning: normal;}    

.color-b0{
    background-color:hsla(0,0%,100%,0.00);
}

.button{
 	display:flex;
	flex-direction: column;
    justify-content: space-between;
    align-content:  space-between;
    position: relative;
 	width:100px;
	height:100px;
    border: 2px solid hsla(360,0%,50%,1.00);
    border-radius: 5px;
	background-color:hsla(360,0%,75%,1.00);
}

.bn_div{
    display: flex;
    flex-direction: column;
    position: absolute;
    left:0;
    top:0;
 	width:100px;
	height:100px;
 	border-radius: 5px;
	background-color:hsla(0,0%,100%,0.00)
}
.b_number_off{font-size: 12pt; margin-left: 2px;}
.b_number_on{font-size: 30pt; margin-left: 0px; margin-top: -11px;}

.mv_div{
	z-index:1;
    display: none;
    position: absolute;
    left:0;
    top:0;
	border-radius: 5px;
}

.bt_div{
	z-index:2;
    display: flex;
    justify-content:flex-end;
    align-items: baseline; 
 	border-radius: 5px 5px 0px 0px;
}
.b_time_ing{font-size: 10pt;}
.b_time{font-size: 10pt; margin-right: 2px;}

.bd_div{
	z-index:3;
    position: absolute;
    left:0;
    top:35px;
 	width:100px;
	height:65px;
    display: flex;
    flex-direction: column;
    align-content: flex-end; 
    justify-content: flex-start;
}

.d_name{
    font-size: 10pt;
    width:inherit;
	/*height:inherit;
    display: flex;
    align-content: flex-end; 
    justify-content: flex-end;*/
    overflow-wrap: break-word;
	/*margin-top : 35px;*/
	line-height: 16px;
	text-align: right;
} /*margin-right: 2px;}*/

/*p{
    overflow-wrap: break-word;
	margin-top : 5px ;
	line-height: 15px;
}*/

.b_lay{
	z-index:4;
    position: absolute;
    left:0;
    top:0;
 	width:100px;
	height:100px;
 	display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
 	border-radius: 5px;
	background-color:hsla(0,0%,100%,0.00)
}

.b_trans{
	z-index:5;
    position: absolute;
    left:0;
    top:0;
 	width:100px;
	height:100px;
 	display:flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
 	border-radius: 5px;
	background-color:hsla(0,0%,100%,0.00)
}

.tool_bar{
	z-index: 20;
	position: absolute;
	display: none;
	flex-direction: column;
	justify-content: space-around;
	align-items: center;
	width: 405px;
	cursor: move;
	/*height:100px;*/
	border: 2px solid hsla(0,0%,50%,1.00);
	border-radius: 10px;
	/*color: white;*/
	background-color: hsla(0,0%,100%,0.30);
}
.close_div{
    display:flex;
    cursor:move;
 	width:inherit;
    height:28px;
    justify-content:flex-end;
    align-items:center;
 	border-top-left-radius: 10px;
 	border-top-right-radius: 10px;
	background-color: hsla(0,0%,100%,0.30);
}
.close_x{
 	cursor: default;
	color: white;
    font-size:28px;
    margin-top:-2px;
    margin-right:6px;
}
.fader_div_1{
    display: flex;
	flex-direction:row;
	flex-wrap: nowrap;
 	width:inherit;
    height:36px;
	justify-content: flex-end;
    align-items: center;
    color:hsla(0,0%,100%,1.00); 
    font-size: 12pt;
    font-weight: bold;
}
.fader_div_0{
    display: flex;
	flex-direction:row;
	flex-wrap: nowrap;
 	width:inherit;
    height:36px;
	justify-content: flex-end;
    align-items: center;
    color:hsla(0,0%,100%,1.00); 
    font-size: 12pt;
    font-weight: bold;
	background-color: hsla(0,0%,100%,0.30);
}
.f_b_div{
    display:flex;
    cursor:pointer;
    align-items: center;
    justify-content:center;
    margin-top: -0px;
    width:30px;
    height:30px;
    border: 1px solid hsla(0,0%,50%,1.00);
	border-radius: 3px;
	background-color:hsla(0,0%,67%,1.00);
    font-size:14px;
    font-weight:bold;
    color:hsla(208,100%,97%,1.00);
    
}
.master{
    cursor:pointer;
    height: 14px;
    width: 200px;
}
.fader{
    cursor:pointer;
    height: 14px;
    width: 100px;
}

/*.tool_font{color:white; font-size: 12pt;font-weight: bold}*/

.confirm_lay_background_style{
	z-index:5;
    display: none;
    justify-content: center;
    align-items: center;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:hsla(0,0%,0%,0.30);
}
.confirm_lay_style{
	display:none;
	height:auto;
	width:auto;
    font-size: 12pt;
    /*vertical-align: middle;*/
    border: 2px solid black;
	border-radius: 5px;
	background-color:white;
}
.confirm_lay_div{
	display:flex;
	height:240px;
	width:240px;
	flex-direction: column;
	align-items: center;
	align-content: space-around;
	justify-content: space-around;
}

.right_click_background_style{
	z-index:5;
    display: none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:hsla(0,0%,0%,0.30);
}
.right_click_lay_style{
	z-index:6;
	position:absolute;
	display:none;
	height:auto;
	width:auto;
    font-size: 12pt;
    /*vertical-align: middle;*/
    border: 2px solid black;
	border-radius: 5px;
	background-color:white;
}
.right_click_lay_div{
	display:flex;
	height:320px;
	width:160px;
	flex-direction: column;
	align-items: center;
	justify-content: space-around;
}
.break_words{/*non flex*/
	width:inherit;
    overflow-wrap: break-word;
    font-weight:bold;
    text-align:center;
}
.each{
    cursor:pointer;
    height: 14px;
    width: 140px;
}
.e-v_div_style{
	display:flex;
	flex-direction:column;
	margin-left: 5px;
	margin-right: 5px;
}
.e-v-line_div_style{
	display:flex;
	flex-direction:row;
	justify-content: space-around;
}
.clear_lay_background_style{
	z-index:7;
    display: none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:hsla(0,0%,0%,0.30);
}
.clear_lay_style{
	z-index:8;
	position:absolute;
	display:none;
	height:100px;
	width:160px;
	flex-direction: column;
	align-content: space-around;
	justify-content: space-around;
    font-size: 12pt;
    /*vertical-align: middle;*/
    border: 2px solid black;
	border-radius: 5px;
	background-color:white;
}
/*.hyouji_table { 
	width: 90%; 
	border: solid 0.4mm black; 
	border-collapse:collapse;
}*/

.size_12 { font-size: 12pt ;}
.size_13 { font-size: 13pt ;}
.size_14 { font-size: 14pt ;}
.size_36 { font-size: 36pt ;}
.size_39 {
    font-size: 38.77pt ;
    transform: scale(1, 1.25);
     display: inline-block;
}

.choice_lay_div{
	z-index:5;
	position: absolute;/*for body*/
	display:flex;
	height: auto;
	width: auto;
	flex-direction:column;
	align-items: center;
	justify-content: space-around;
	border-radius: 5px;
	background-color: hsla(0,0%,100%,1.00);
}
.choice_row_div{ 
    height: 1000px;
    width: auto;
    display:flex;
	flex-direction:row;
  	flex-wrap:wrap;
	align-items: center;
	justify-content: space-around;
	border-radius: 5px;
	background-color: hsla(0,0%,100%,1.00);
}
.check_div{
	display:flex;
	height: auto;
	width: auto;
	flex-direction:row;
 	align-items: center;
	justify-content:center;
	border-radius: 4px;
    /*border: 1px solid hsla(0,0%,50%,1.00);*/
}
.choice_bk_ground{
    position: relative;
    display:flex;
	flex-direction:row;
  	flex-wrap:wrap;
	cursor: pointer;
    justify-content:space-around;
	align-content: space-around;
	border-radius: 4px;
	/*color: white;*/
    border: 1px solid hsla(0,0%,50%,1.00);
	background-color:hsla(208,100%,97%,1.00);    
}
.choice_button{
 	display:flex;
	cursor: pointer;
    justify-content:center;
    align-items:center;
 	width: 28px;
	height:28px;
    border: 1px solid hsla(0,0%,50%,1.00);
    border-radius: 2px;
	background-color:hsla(0,0%,67%,1.00);
}
.choice_b_num{
	cursor: pointer;
	margin-top:5px;
	font-size:16pt;
    margin-bottom: 2pt;
	color:white;
}
.default_b{
    background-color:hsla(0,0%,50%,1.00);
    color:white;
}
.canvas_css{
    visibility: hidden;
}
.seek_lay_background_style{
	z-index:9;
    display: none;
    justify-content: center;
    align-items: center;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background-color:hsla(0,0%,0%,0.30);
}
.seek_lay_style{
	display:none;
	height:auto;
	width:auto;
    font-size: 12pt;
    /*vertical-align: middle;*/
    border: 2px solid black;
	border-radius: 5px;
	background-color:white;
}
.seek_lay_div{
	display:flex;
	height:36px;
	width:340px;
    font-weight: bold; 
	flex-direction: column;
	align-items: center;
	align-content: space-around;
	justify-content: space-around;
}